<template>
	<view class="container">
		<view class="top">
			<view class="topl">
				<navigator>本学期已上报</navigator>
				<text class="text1">127/128次</text>
			</view>
			<view class="topr">
				<navigator>本学期异常名单</navigator>
				<text>100人</text>
			</view>
		</view>
		<view class="mid">
			<text>日期列表</text>
			<text>本周</text>
		</view>
		<navigator url="/pages/school/Abnormal">
			<view class="bot">
			<view class="bot1">
				<view class="bot1t">
					<img src="../../static/rili.png" alt="" />
					<text class="text2">2024年8月4日（今天）</text>
					<text>异常人数：1</text>
				</view>
				<view class="bot1b">
					<text>异常说明关键词：#着急出校#</text>
				</view>
			</view>
			<view class="bot1">
				<view class="bot1t">
					<img src="../../static/rili.png" alt="" />
					<text class="text2">2024年8月4日（今天）</text>
					<text>异常人数：1</text>
				</view>
				<view class="bot1b">
					<text>异常说明关键词：#着急出校#</text>
				</view>
			</view>
			<view class="bot1">
				<view class="bot1t">
					<img src="../../static/rili.png" alt="" />
					<text class="text2">2024年8月4日（今天）</text>
					<text>异常人数：1</text>
				</view>
				<view class="bot1b">
					<text>异常说明关键词：#着急出校#</text>
				</view>
			</view>
			<view class="bot1">
				<view class="bot1t">
					<img src="../../static/rili.png" alt="" />
					<text class="text2">2024年8月4日（今天）</text>
					<text>异常人数：1</text>
				</view>
				<view class="bot1b">
					<text>异常说明关键词：#着急出校#</text>
				</view>
			</view>
			<view class="bot1">
				<view class="bot1t">
					<img src="../../static/rili.png" alt="" />
					<text class="text2">2024年8月4日（今天）</text>
					<text>异常人数：1</text>
				</view>
				<view class="bot1b">
					<text>异常说明关键词：#着急出校#</text>
				</view>
			</view>
			<view class="bot1">
				<view class="bot1t">
					<img src="../../static/rili.png" alt="" />
					<text class="text2">2024年8月4日（今天）</text>
					<text>异常人数：1</text>
				</view>
				<view class="bot1b">
					<text>异常说明关键词：#着急出校#</text>
				</view>
			</view>
			<view class="bot1">
				<view class="bot1t">
					<img src="../../static/rili.png" alt="" />
					<text class="text2">2024年8月4日（今天）</text>
					<text>异常人数：1</text>
				</view>
				<view class="bot1b">
					<text>异常说明关键词：#着急出校#</text>
				</view>
			</view>
		</view>
		</navigator>
		
	</view>
</template>
<script setup>
	import { ref, onMounted } from 'vue';
	
</script>
<style>
	.container {
		width: 375px;
		height: 723px;
		background: #F3F5F9;
		margin: 0 auto;
	}
	.top{
		display: flex;
		flex-direction: row;
	}
	.topl,.topr {
		width: 170px;
		height: 100px;
		margin-left: 12px;
		margin-top: 18px;
		border: 1px solid;
		border-radius: 12px;
		background-image: url(../static/bg2.png);
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
	}
	.navigator {
		width: 73px;
		height: 15px;
		font-size: 12px;
		margin-bottom: 12px;
	}
	.text1 {
		color: #FFFFFF;
	}
	.mid {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
	}
	.mid text:nth-child(1) {
		font-size: 15px;
		margin-left: 12px;
		margin-top: 12px;
	}
	.mid text:nth-child(2) {
		font-size: 12px;
		color: #006DFF;
		margin-top: 13px;
		margin-right: 25px;
	}
	.bot {
		width: 351px;
		height: 526px;
		border: 1px solid;
		border-radius: 12px;
		margin-left: 12px;
		margin-top: 10px;
		background-color: #FFFFFF;
	}
	.bot1 {
		width: 328px;
		height: 61px;
		display: flex;
		flex-direction: column;
		margin-left: 12px;
		margin-top: 12px;
	}
	.bot1t{
		display: flex;
		flex-direction: row;
		margin-top: 12px;
		margin-left: 12px;
		margin-bottom: 8px;
	}
	.bot1t text {
		font-size: 15px;
	}
	.bot1b text {
		font-size: 12px;
		margin-left: 12px;
	}
	.img {
		width: 14px;
		height: 14px;
	}
	.text2 {
		margin-right: 42px;
	}
</style>